<template>
  <div class="header-btn-container">
    <hover-container :tooltip-content="isFullscreen ? '取消全屏' : '全屏'">
      <div class="flex-between" style="width: 40px">
        <n-icon
          size="24"
          style="cursor: pointer"
          :component="
            isFullscreen ? FullscreenExitOutlined : FullscreenOutlined
          "
          @click="changeFullscreen"
        >
        </n-icon>
      </div>
    </hover-container>
  </div>
</template>

<script lang="ts" setup>
import { FullscreenOutlined, FullscreenExitOutlined } from "@vicons/antd";
import { fullScreenEvent } from "@/layouts/Header/fullScreenEvent";
import HoverContainer from "@/components/Common/HoverContainer.vue";

// 全屏
const { isFullscreen, changeFullscreen } = fullScreenEvent();
</script>

<style scoped></style>
